<!DOCTYPE html>

<html lang="en" style="font-size:13.33vw">

<head>

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta http-equiv="X-UA-Compatible" content="ie=edge">

    <title>Xinkenft</title>

    <link rel="stylesheet" href="/index/css/style.css">


    {load href="/static/jquery/jquery-1.9.1.min.js" /}

    <!-- LayerUi库 -->

    {load href="/static/layer/layer.js"/}

    {load href="/static/jquery.form.js" /}

    {load href="/static/verify.js" /}


    <script type="text/javascript">
        document.oncontextmenu = function () {
            return false
        }
    </script>


    <style>
        #back {
            display: flex;
            flex-direction: left;
            margin-bottom: 20px;
            background-color:;
        }

        header {
            margin-bottom: 20px;
        }

        #think_page_trace_open {
            display: none !important;
        }

        .yanjing, .yanjing_hide {
            width: 20px;
            margin-right: 12px;
        }


        .tis {
            font-size: 14px;
            font-weight: 600;
            color: #131415;
            /*line-height: 20px;*/
            margin-bottom: 5px;
        }

        .login-form {
            background: #eee;
            border-radius: 15px;
            box-sizing: border-box;
            padding: 20px;
        }

        .slit {
            margin: 10px 0;
        }

        .sjx {
            width: 0;
            height: 0;
            border: 7px solid;
            border-color: #999999 transparent transparent;
            /*margin: 0 10px;*/
            margin-top: 5px;
            margin-left: 5px;
        }

        .txts {
            width: 55px;
        }

        .code {
            background: #fff;
            border-radius: 12px;
            padding-left: 15px;
            font-size: 13px;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #333333;
        }

        .qh {
            /*display: none;*/
            align-items: flex-end;
            display: flex;
            justify-content: center;
            align-items: center;
        }

        .zezhao {
            position: fixed;
            background: rgba(0, 0, 0, 0.48);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 9;
            display: none;
        }

        .lqfl {
            position: fixed;
            background: rgba(0, 0, 0, 0.48);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 9;
            display: block;
        }

        .lqed {
            position: fixed;
            background: rgba(0, 0, 0, 0.48);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 9;
            display: none;
        }

        .list {
            display: flex;
            flex-direction: column;
            width: 100%;
            height: 300px;
            overflow: auto;
            background: #ffffff;
            margin: 0 auto;
            position: absolute;
            bottom: 0;
        }

        .item {
            width: 100%;
            text-align: center;
            border-bottom: 1px solid #f8f8f8;
            margin: 10px 0;
            padding: 5px 0;
            height: 25px;
        }

        .xieyi {
            position: fixed;
            background: rgba(0, 0, 0, 0.48);
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 9;
            display: none;
        }

        .box {
            display: flex;
            flex-direction: column;
            width: 100%;
            height: 500px;
            overflow: auto;
            background: #ffffff;
            margin: 0 auto;
            position: absolute;
            bottom: 0;
        }


        .conts {
            padding: 0.2rem 0.2rem 1rem;
        }

        .btoo {
            background: #ffffff;
            position: fixed;
            bottom: 0;
            left: 50%;
            line-height: 0.6rem;
            transform: translateX(-50%);
            width: 100%;
            height: 1rem;
        }

        .wdb {
            width: 5.7rem;
            height: 0.6rem;
            background: #2F73FD;
            box-shadow: 0px 0.04rem 0.08rem 0px #a6c4ff;
            border-radius: 0.45rem;
            border: 0;
            font-weight: 600;
            color: #FBFBFB;
            text-align: center;
            margin: 10px auto;

        }


        }
        from .pact input {
            flex: 0;
        }

        .ph {
            display: none;
            border-radius: 16px;
        }

        #second {
            font-size: 14px;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #000000;
            line-height: 20px;
            padding-right: 14px;
        }

        /* 第一种解决方案：css3样式改变checkbox默认样式 */
        .pacts {
            flex: none;
            width: 14px;
            height: 14px;
            padding: 0;
            background: #ffffff;
            border-radius: 2px;
            border: 1px solid #999999;
        }

        .checkbox-item {
            margin-right: 20px;
            display: inline-block;
            position: relative;
        }

        .checkbox-item label {
            line-height: 34px;
            vertical-align: middle;
            cursor: pointer;
        }

        .checkbox-item input[type="checkbox"] {
            margin-right: 5px;
            width: 14px;
            height: 14px;
            visibility: hidden;
        }

        /* 设计新的checkbox，位置 */
        .checkbox-item label:BEFORE {
            content: '';
            position: absolute;
            top: 10px;
            left: 0px;
            width: 14px;
            height: 14px;
            border-radius: 2px;
            border: 1px solid #bbb;
            background: #fff;
            cursor: pointer;
        }

        /* 点击初始的checkbox，将新的checkbox关联起来 */
        .checkbox-item input[type="checkbox"]:checked + label:BEFORE {
            content: '\2713';
            display: block;
            line-height: 14px;
            vertical-align: middle;
            text-align: center;
            background-color: #1890FF;
            color: #ffffff;
        }

        .ant-btn {
            background: #000000;
            border-radius: 8px;
            background: #000;
            color: fff;
            margin-top: 24px;
        }

        #verify_code {
            width: 140px;
        }

        #ntitle {
            font-size: 22px;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #333333;
            line-height: 30px;
            text-align: center;
            margin-top: 10px;
        }

        .tuijian {
            width: 266px;
            height: 45px;
            background: #FFF4E3;
            border-radius: 23px;
            display: flex;
            justify-content: center;
            line-height: 45px;
            margin: 0 auto;
            margin-top: 30px;
        }

        .tj_text {
            font-size: 14px;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #333333;
        }

        #referee {
            font-size: 20px;
            font-family: PingFangSC-Semibold, PingFang SC;
            font-weight: 600;
            color: #F5A623;
            margin-left: 16px;
        }

        .em {
            border-radius: 16px;
            margin-left: 5px;
        }
    </style>

    <script>


        var newList = []
        var types = false
        var result = true
        var code = '86'

        $(function () {

            $("#second").click(function () {

                sendyzm($("#second"));

            });

            $('.lqs').click(function () {
                $('.lqed').css('display', 'none')
                //  parent.layer.close(index);
                location.href = "/download";
            })

            $("#type").val(2);
            $('.type').click(function () {
                types = !types
                if (types) {
                    $('.type').html('手机号')
                    $('.tis1').html('邮箱注册')
                    $('.ph').css('display', 'none')
                    $('.em').css('display', 'block')

                    // $('.qh').css('display', 'none');
                    $("#type").val(2);

                } else {
                    $('.type').html('邮箱注册')
                    $('.tis1').html('手机号')
                    $('.ph').css('display', 'block')
                    $('.em').css('display', 'none')

                    $('.qh').css('display', 'flex');
                    $("#type").val(1);

                }
            })

            $('.lqbtn').click(function () {
                $('.lqfl').css('display', 'none');
            })
            $('.pacts').click(function () {
                $('.pacts').css('background', '#2f73fd')
            })
            $(".xy").click(function () {
                $.ajax({

                    url: "/getConfigDetail",

                    data: {id: '11'},

                    dataType: "json",

                    type: "get",

                    async: false,

                    cache: false,

                    success: (res) => {
                        if (res.code == 200) {
                            $('.xieyi').css('display', 'block');
                            $('.conts').html(res.data.value)
                        }
                    },

                    error: function () {
                    }

                })
            })
            $(".wdb").click(function () {
                $('.xieyi').css('display', 'none');
                $('.pacts').css('background', '#2f73fd')
            })

            $('.checkbox-item').click(function () {


                if (document.getElementById('item1').checked) {
                    document.getElementById('item1').checked = false

                } else {
                    document.getElementById('item1').checked = true
                }

            })


            $(".qh").click(function () {
                $.ajax({

                    url: "/mobileCode",

                    data: {},

                    dataType: "json",

                    type: "get",

                    async: false,

                    cache: false,

                    success: (res) => {
                        if (res.code == 200) {
                            // alert("验证码发送成功");
                            newList = res.data.sms_list
                            let data = []
                            for (var i = 0, len = newList.length; i < len; i++) {
                                data += '<div class="item">' + newList[i].name + newList[i].code + '</div>'
                            }

                            $('.zezhao').css('display', 'block');
                            $('.list').html(data)
                            btn(newList)
                        }
                    },

                    error: function () {
                    }

                })
            })

            function btn(list) {
                var list = list
                var btnArray = document.getElementsByClassName('item');
                var htmls = ''
                for (var i = 0; i < btnArray.length; i++) {
                    btnArray[i].onclick = (function close(j) {
                        return () => {
                            console.log(list[j])
                            htmls = list[j].name + '+' + list[j].code
                            $(".txts").html(htmls);
                            code = list[j].code
                            $('.zezhao').css('display', 'none');

                        }
                    })(i);
                }


            }


            $(document).on('click', '.yanjing', function () {
                $(this).attr('src', '/index/images/2.png');
                $(this).attr('class', 'yanjing_hide')
                $(this).prev().attr('type', 'text')
            })
            $(document).on('click', '.yanjing_hide', function () {
                $(this).attr('src', '/index/images/12.png');
                $(this).attr('class', 'yanjing')
                $(this).prev().attr('type', 'password')
            })
            $(document).on('click', '.yanjing2', function () {
                $(this).attr('src', '/index/images/2.png');
                $(this).attr('class', 'yanjing2_hide')
                $(this).prev().attr('type', 'text')
            })
            $(document).on('click', '.yanjing2_hide', function () {
                $(this).attr('src', '/index/images/12.png');
                $(this).attr('class', 'yanjing2')
                $(this).prev().attr('type', 'password')
            })

            //用ajax提交到后台的发送短信接口

            function sendyzm(obj) {

                // var phone =types?$("#userEmail").val(): $("#userPhone").val();
                var phone = $("#userPhone").val();
                var password = $("#password").val();
                var repassword = $("#repassword").val();

                var result = isPhoneNum();

                if (result) {

                    $.ajax({

                        url: "/shayuSms",

                        data: {

                            username: phone,
                            token: 123456,
                            // type : types?'2':'1',


                        },
                        headers: {'token': 123456},

                        dataType: "json",

                        type: "post",

                        async: false,

                        cache: false,

                        success: function (res) {

                            if (res.code == 200) {

                                parent.layer.open({
                                    type: 1,
                                    title: false,
                                    closeBtn: 0, //不显示关闭按钮
                                    scrollbar: false,
                                    shade: 0,
                                    time: 3000, //2秒后自动关闭
                                    //offset: '67px',
                                    shift: 5,
                                    content: '<div class="HTooltip bounceInDown animated gree" >验证码发送成功</div>', //iframe的url，no代表不显示滚动条
                                });

                            } else {

                                if (res.msg == "已注册,请在登录页登录") {

                                    window.location.href = "/download.html"

                                }

                                parent.layer.open({
                                    type: 1,
                                    title: false,
                                    closeBtn: 0, //不显示关闭按钮
                                    scrollbar: false,
                                    shade: 0,
                                    time: 3000, //2秒后自动关闭
                                    //offset: '67px',
                                    shift: 5,
                                    content: '<div class="HTooltip bounceInDown animated red" >' + res.msg + '</div>', //iframe的url，no代表不显示滚动条
                                });

                            }

                        },

                        error: function () {

                            parent.layer.open({
                                type: 1,
                                title: false,
                                closeBtn: 0, //不显示关闭按钮
                                scrollbar: false,
                                shade: 0,
                                time: 3000, //2秒后自动关闭
                                //offset: '67px',
                                shift: 5,
                                content: '<div class="HTooltip bounceInDown animated red" >验证码发送失败</div>', //iframe的url，no代表不显示滚动条
                            });

                        }

                    })

                    setTime(obj);//开始倒计时

                }

            }

            $(".submit").click(function () {

                regin();

            });

// 注册
            function regin(obj) {


                // var phone =types?$("#userEmail").val(): $("#userPhone").val();
                var phone = $("#userPhone").val();
                var password = $("#password").val();
                var repassword = $("#repassword").val();
                var referee = $("#referee").html();
                console.log(referee)
                var verify_code = $("#verify_code").val();
                // var checked = $('#item1').get(0).checked;
                var checked = true;
                if (checked == false) {
                    parent.layer.open({
                        type: 1,
                        title: false,
                        closeBtn: 0, //不显示关闭按钮
                        scrollbar: false,
                        shade: 0,
                        time: 3000, //2秒后自动关闭
                        //offset: '67px',
                        shift: 5,
                        content: '<div class="HTooltip bounceInDown animated red" >请先认真阅读注册协议</div>', //iframe的url，no代表不显示滚动条
                    });
                    return;
                }

                if (result) {
                    result = false;
                    $(".submit").text('注册中...').css({"opacity": "0.8", "cursor": "default"});
                    $.ajax({

                        url: "/v1/register",

                        data: {
                            username: phone,
                            password: password,
                            repassword: repassword,
                            verify_code: verify_code,
                            referee: referee,
                            // loing_type:types?'2':'1',
                        },
                        headers: {'token': 123456},
                        dataType: "json",

                        type: "post",

                        async: false,

                        cache: false,

                        success: function (res) {
                            if (res.code == 200) {
                                $('.lqed').css('display', 'block')
                                $('.ednum').html(res.data.registerMoney + '额度')
                                window.location.href = "/download.html"
                            } else {

                                if (res.msg == "已注册,请在登录页登录") {

                                    window.location.href = "/download.html"

                                }

                                parent.layer.open({
                                    type: 1,
                                    title: false,
                                    closeBtn: 0, //不显示关闭按钮
                                    scrollbar: false,
                                    shade: 0,
                                    time: 3000, //2秒后自动关闭
                                    //offset: '67px',
                                    shift: 5,
                                    content: '<div class="HTooltip bounceInDown animated red" >' + res.msg + '</div>', //iframe的url，no代表不显示滚动条
                                });

                            }

                        },

                        error: function () {

                            parent.layer.open({
                                type: 1,
                                title: false,
                                closeBtn: 0, //不显示关闭按钮
                                scrollbar: false,
                                shade: 0,
                                time: 3000, //2秒后自动关闭
                                //offset: '67px',
                                shift: 5,
                                content: '<div class="HTooltip bounceInDown animated red" >' + res.msg + '</div>', //iframe的url，no代表不显示滚动条
                            });

                        },
                        complete: function () {
                            result = true;
                            $(".submit").text('注册').css({"opacity": "1", "cursor": "default"});
                        },

                    })


                }

            }

            //60s倒计时实现逻辑

            var countdown = 60;


            function setTime(obj) {

                if (countdown == 0) {

                    obj.prop('disabled', false);

                    obj.text("获取验证码");

                    countdown = 60;//60秒过后button上的文字初始化,计时器初始化;

                    return;

                } else {

                    obj.prop('disabled', true);

                    obj.text("(" + countdown + "s)后重新发送");

                    countdown--;

                }

                setTimeout(function () {

                    setTime(obj)

                }, 1000) //每1000毫秒执行一次

            }


            //校验手机号是否合法

            function isPhoneNum() {
                if (types) {
                    return true
                }
                var phonenum = $("#userPhone").val();

                var reg = /^(((13[0-9]{1})|(15[0-9]{1})|(18[0-9]{1})|(17[0-9]{1})|(19[0-9]{1}))+\d{8})$/;

                if (!reg.test(phonenum)) {

                    alert('请输入有效的手机号码！');

                    return false;

                } else {

                    return true;

                }

            }


        });

    </script>

</head>

<body>

<div class="content">

    <div class="zezhao">


        <div class="list">
            <div class="item" v-for='(item,index) in newList'>
                中国 +86
            </div>
        </div>

    </div>

    <!--<div class="lqfl">-->
    <!--    <div class="boxs">-->
    <!--        <div class="stop">-->
    <!--            <div class="l">-->
    <!--                <img src="__MODULE_IMG__/logo.png" alt="" srcset="" style="heigth:1.6rem;width:1.6rem">-->
    <!--            </div>-->
    <!--            <div class="r">-->
    <!--                <div class="bts">-->
    <!--                    KingTrader量化机器人-->
    <!--                </div>-->
    <!--                <div class="bts-d">-->
    <!--                    用数字模型科学炒币-->
    <!--                </div>-->
    <!--            </div>-->
    <!--        </div>-->
    <!--        <div class="sbg">.-->

    <!--            <div class="txt1">-->
    <!--                收到一个额度红包-->
    <!--            </div>-->
    <!--            <div class="txt2">-->
    <!--                尾号额度红包-->
    <!--            </div>-->
    <!--            <div class="lqbtn">-->
    <!--                免费领取-->
    <!--            </div>-->

    <!--        </div>-->
    <!--    </div>-->

    <!--</div>-->

    <div class="lqed">
        <div class="boxbg">
            <div class="txt3">
                已存入您的KingTrader额度账户
            </div>
            <div class="ednum">
                100额度
            </div>
            <div class="txt4">
                下载APP查看账户额度即可免费开启量化~
            </div>
            <div class="lqbtn lqs">
                立即开启
            </div>
        </div>
    </div>

    <div class="xieyi">
        <div class="box">


            <div class="conts">

            </div>
            <div class="btoo">
                <div class="wdb">
                    我已经认真阅读
                </div>
            </div>
        </div>

    </div>

    <header>
        <div id="back">
            <img src="/index/images/regback.png" alt="" srcset="" style="width:20px;height:16px">
        </div>
        <img src="/index/images/reglogo.png" alt="" srcset="" style="heigth:1.6rem;width:1.6rem">
        <div id="ntitle">
            星科NFT
        </div>
        <div class="tuijian">
            <div class="tj_text">推荐人邀请码</div>
            <div id="referee">{$invite_code}</div>
        </div>
    </header>

    <!--<div class="title ">账号注册</div>-->

    <!--<div class="des">您好，欢迎来到KingTrader</div>-->

    <form class="ant-form ant-form-horizontal login-form validFormData" place="right">

        <div class="slit">
            <div class="tis1 tis">
                手机号
            </div>

            <div class="code">
                <div class="qh">
                    <div class="txts">中国+86</div>
                    <div class="sjx"></div>
                </div>

                <!--<input type="number" id="userPhone" placeholder="请输入手机号" nullable="false" star="false" class="ph" >-->
                <input id="userPhone" placeholder="请输入手机号" nullable="false" star="false" class="em">

                <!--userEmail-->
            </div>

        </div>

        <div class="slit">

            <div class="tis">
                验证码
            </div>
            <div class="code">

                <input id="verify_code" type="text" placeholder="验证码" nullable="false" star="false" alt="请输入验证码">

                <button type="button" class="btn btn-info" id="second">获取验证码</button>

            </div>
        </div>
        <div class="slit">

            <div class="tis">
                密码
            </div>
            <div class="code">

                <input id="password" type="password" placeholder="请输入密码" nullable="false" star="false"
                       alt="请输入密码">
                <img class="yanjing" src="/index/images/12.png">

            </div>
        </div>
        <div class="slit">

            <div class="tis">
                再次输入密码
            </div>
            <div class="code">

                <input id="repassword" type="password" placeholder="再次输入密码" nullable="false"
                       star="false" alt="再次输入密码">
                <img class="yanjing" src="/index/images/12.png">

            </div>
        </div>

        <!--<div class="slit">-->

        <!--    <div class="tis">-->
        <!--        邀请码-->
        <!--    </div>-->
        <!--    <div class="">-->

        <!--        <input id="referee" value="{$invite_code}" type="text" placeholder="请输入邀请码（必填）" nullable="false"-->

        <!--               star="false" alt="请输入邀请码">-->

        <!--    </div>-->
        <!--</div>-->


        <!--<div class="checkbox-item pact">-->
        <!--    <input id="item1" type="checkbox"/>-->
        <!--    <label> 我已经认真阅读 <span class="xy">《KingTrader协议》</span>-->
        <!--</div>-->


        <!-- <div class="bts-buttom">-->

        <!--<span class="type">-->
        <!--    手机号-->
        <!--</span>-->
        <!--     <div >-->
        <!--         <a href="/download.html">已注册? <span-->
        <!--                 style="color:#2f73fd">去下载app</span></a></div>-->
        <!-- </div>-->

    </form>
    <div class="ant-btn  submit" style="padding:2px 15px;">注册并领取

    </div>

</div>

</body>

<!--{load href="/base/js/common.js" /}-->
</html>

